Sudo Slider jQuery Plugin - Methods demo 3 Inserting and removing slides
Methods in docs
Usage
Include the javascripts
<script type="Text/Javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="../js/jquery.sudoSlider.min.js"></script>
The Javascript to start it.
<script type="text/javascript" >
$(document).ready(function(){
var sudoSlider = $("#slider").sudoSlider({
numeric:true
});
$('#target').click(function() {
var pos = $('#SudoSliderPos').val();
var content = $('#SudoSliderContent').val();
var numericText = $('#SudoSliderNumText').val();
sudoSlider.insertSlide(content, pos, numericText);
return false;
});
$('#target2').click(function() {
var pos = $('#SudoSliderPos').val();
sudoSlider.removeSlide(pos);
return false;
});
});
</script>
The HTML
<div id="slider" >
<ul>
<li><img src="../images/01.jpg" alt="image description"/></li>
<li><img src="../images/02.jpg" alt="image description"/></li>
<li><img src="../images/03.jpg" alt="image description"/></li>
<li><img src="../images/04.jpg" alt="image description"/></li>
<li><img src="../images/05.jpg" alt="image description"/></li>
</ul>
</div>
<form>
Position: <input id="SudoSliderPos" type="text" value="1"/><br />
<b>The next 2 are only relevant if you are inserting a slide. </b><br />
Content (if you insert content):<input id="SudoSliderContent" type="text" /><br />
Numeric Text: <input id="SudoSliderNumText" type="text" /><br />
<input type="submit" value="insertSlide" id="target" />
<input type="submit" value="removeSlide" id="target2" />
</form>